import {onMounted, ref,  reactive, computed } from 'vue';
import { hiprint, defaultElementTypeProvider, print } from"vue-plugin-hiprint";
import notification from '@arco-design/web-vue/es/notification';
import printData from './print-data'
import panelMode from './panel.json'
import template from '@/utils/dyMode';
export default function importConfig() {
    const base = reactive<any>({
        template: null,
        curPaper: {
            type: 'A4',
            width: 210,
            height: 296.6
        },
        paperTypes: {
            'A3': {
              width: 420,
              height: 296.6
            },
            'A4': {
              width: 210,
              height: 296.6
            },
            'A5': {
              width: 210,
              height: 147.6
            },
            'B3': {
              width: 500,
              height: 352.6
            },
            'B4': {
              width: 250,
              height: 352.6
            },
            'B5': {
              width: 250,
              height: 175.6
            }
        },
        paperPopVisible: false,
        scaleValue: 1,
        scaleMax: 5,
        scaleMin: 0.5,
        jsonAreaVisible: false,
        jsonText: '',
    })

    
    // 初始化 provider
    hiprint.init({
        providers: [defaultElementTypeProvider()],
    });
    
    let panel = null;
    /**
     * 加载 panel
     */
    const getPanel = () => {
      // 加载所有 panel
      const panels = require.context('./', true, /panel.*\.js$/)
      // 对所有 panel 进行版本解析
      var panelInfos = panels.keys().map(key => ({
        ...decodeVer(key.replace(/(\.\/panel-?)|(\.js)/g, '')),
        key
      }))
      // 存在一个固定版本号，并且不是开发版本
      if (this.$parent.version && this.$parent.version != "development") {
        // 解析对应版本信息
        var currVerInfo = decodeVer(this.$parent.version)
        // 查找小于等于当前版本的 panel
        var newVers = panelInfos.filter(({verVal}) => verVal <= currVerInfo.verVal)
          // 对版本号进行倒叙
          .sort((acc, curr) => curr.verVal - acc.verVal)
        // 获取最大版本号面板 json
        panel = panels(newVers[0].key).default
      }
      // 不存在固定版本，加载默认面板 json
      else {
        panel = panels('./panel.js').default
      }
    }

    /**
     * 这里必须要在 onMounted 中去构建 左侧可拖拽元素 或者 设计器
     * 因为都是把元素挂载到对应容器中, 必须要先找到该容器
     */
    onMounted(() => {
        buildLeftElement();
        buildDesigner();
        base.template = hiprintTemplate.getJson();
        // getPanel();
        // init();
    });

    
    /**
     * 构建左侧可拖拽元素
     * 注意: 可拖拽元素必须在 hiprint.init() 之后调用
     * 而且 必须包含 class="ep-draggable-item" 否则无法拖拽进设计器
     */
    const buildLeftElement = () => {
        // eslint-disable-next-line no-undef
        hiprint.PrintElementTypeManager.buildByHtml($(".ep-draggable-item"));
    };


    let hiprintTemplate;
    const buildDesigner = () => {
        // eslint-disable-next-line no-undef
        // panelMode.panels[0].paperHeader = 300;
        $("#hiprint-printTemplate").empty(); // 先清空, 避免重复构建
        hiprintTemplate = new hiprint.PrintTemplate({
            template: panelMode,
            settingContainer: "#PrintElementOptionSetting", // 元素参数容器
        });
        // 构建 并填充到 容器中
        hiprintTemplate.design("#hiprint-printTemplate");
    };


    base.curPaperType = computed(() => {
        let type = 'other'
        let types = base.paperTypes
        for (const key in types) {
            let item = types[key]
            let {width, height} = base.curPaper
            if (item.width === width && item.height === height) {
            type = key
            }
        }
        return type
    })


    // 设置纸张大小
    const setPaper = (type, value) => {
      try {
          if (Object.keys(base.paperTypes).includes(type)) {
            base.curPaper = {type: type, width: value.width, height: value.height}
            hiprintTemplate.setPaper(value.width, value.height)
          } else {
            base.curPaper = {type: 'other', width: value.width, height: value.height}
            hiprintTemplate.setPaper(value.width, value.height)
          }
        } catch (error) {
          console.error(error);
      }
    }

    // 
    const changeScale = (big) => {
      let scaleValue = base.scaleValue;
      if (big) {
        scaleValue += 0.1;
        if (scaleValue > base.scaleMax) scaleValue = 5;
      } else {
        scaleValue -= 0.1;
        if (scaleValue < base.scaleMin) scaleValue = 0.5;
      }
      if (hiprintTemplate) {
        // scaleValue: 放大缩小值, false: 不保存(不传也一样), 如果传 true, 打印时也会放大
        hiprintTemplate.zoom(scaleValue);
        base.scaleValue = scaleValue;
      }
    }


    // 旋转
    const rotatePaper = () => {
      if (hiprintTemplate) {
        hiprintTemplate.rotatePaper()
      }
    }


    // 预览
    const preViewEle = ref();
    const preView = () => {
      let beautify = base.beautify ? 2 : 0;
      let jsonOut = JSON.stringify(hiprintTemplate.getJson(), null, beautify);
      console.log(JSON.stringify(hiprintTemplate.getJson()));
      // 测试, 点预览更新拖拽元素
      hiprint.updateElementType('defaultModule.text', (type) => {
        type.title = '这是更新后的元素';
        return type
      })
      // 测试, 通过socket刷新打印机列表； 默认只有连接的时候才会获取到最新的打印机列表
      hiprint.refreshPrinterList((list) => {
        console.log('refreshPrinterList')
        console.log(list)
      });
      // 测试, 获取IP、IPV6、MAC地址、DNS
      // 参数格式：
      // 1. 类型（ip、ipv6、mac、dns、all、interface、vboxnet）
      // 2. 回调 data => {addr, e}  addr: 返回的数据 e:错误信息
      // 3. 其他参数 ...args
      hiprint.getAddress('ip', (data) => {
        console.log('ip')
        console.log(data)
      })
      hiprint.getAddress('ipv6', (data) => {
        console.log('ipv6')
        console.log(data)
      })
      hiprint.getAddress('mac', (data) => {
        console.log('mac')
        console.log(data)
      })
      hiprint.getAddress('dns', (data) => {
        console.log('dns')
        console.log(data)
      })
      hiprint.getAddress('all', (data) => {
        console.log('all')
        console.log(data)
      })
      // 各个平台不一样, 用法见: https://www.npmjs.com/package/address
      hiprint.getAddress('interface', (data) => {
        console.log('interface')
        console.log(data)
      }, 'IPv4', 'eth1')

      // printData这个式表格数据
      preViewEle.value.show(hiprintTemplate, printData)
    }


    // 直接打印
    const print = () => {
      // console.log(window.hiwebSocket)
      // 检测打印
      // if (window.hiwebSocket.opened) {
      //   const printerList = hiprintTemplate.getPrinterList();
      //   console.log(printerList)
      //   hiprintTemplate.print2(printData, {printer: '', title: 'hiprint测试打印'});
      //   return
      // }

      const printerList = hiprintTemplate.getPrinterList();
      console.log(printerList)
      hiprintTemplate.print2(printData, {printer: '', title: 'hiprint测试打印'});

      // this.$error({
      //   title: "客户端未连接",
      //   content: (h) => (
      //     <div>
      //       连接【{hiwebSocket.host}】失败！
      //       <br />
      //       请确保目标服务器已
      //       <a
      //         href="https://gitee.com/CcSimple/electron-hiprint/releases"
      //         target="_blank"
      //       >
      //         下载
      //       </a>
      //       并
      //       <a href="hiprint://" target="_blank">
      //         运行
      //       </a>
      //       打印服务！
      //     </div>
      //   ),
      // });
    }

    const onlyPrint = () => {
      console.log(panelMode)
      let hiprintTemplatePrint = new hiprint.PrintTemplate({ template: hiprintTemplate.getJson()});
      // console.log(hiprintTemplate)
      hiprintTemplatePrint.print(printData);
    }


    // 清空
    const clearPaper = () => {
      console.log(hiprintTemplate);
      try {
        hiprintTemplate.clear();
      } catch (error) {
        notification.error("清除失败！");
      }
    }


    // json
    const init = () => {
      
      base.template = hiprintTemplate = new hiprint.PrintTemplate({
        template: panelMode,
        // 图片选择功能
        onImageChooseClick: (target) => {
          // 测试 3秒后修改图片地址值
          setTimeout(() => {
            target.refresh("", {
              real: true // 根据图片实际尺寸调整(转pt)
            })
          }, 3000)
        },
        // 自定义可选字体
        fontList: [
          {title: '微软雅黑', value: 'Microsoft YaHei'},
          {title: '黑体', value: 'STHeitiSC-Light'},
          {title: '思源黑体', value: 'SourceHanSansCN-Normal'},
          {title: '王羲之书法体', value: '王羲之书法体'},
          {title: '宋体', value: 'SimSun'},
          {title: '华为楷体', value: 'STKaiti'},
          {title: 'cursive', value: 'cursive'},
        ],
        dataMode: 1, // 1:getJson 其他：getJsonTid 默认1
        history: true, // 是否需要 撤销重做功能
        willOutOfBounds: true, // 是否允许组件内的控件超出范围
        qtDesigner: true, // 是否开启类似QT Designer的唯一field生成模式
        onDataChanged: (type, json) => {
          console.log(type); // 新增、移动、删除、修改(参数调整)、大小、旋转
          console.log(json); // 返回 template
        },
        onUpdateError: (e) => {
          console.log(e);
        },
        settingContainer: '#PrintElementOptionSetting',
        paginationContainer: '.hiprint-printPagination'
      });
    }
    
    const viewJsonFun = () => {
      base.jsonAreaVisible = true;
      base.jsonText = JSON.stringify(hiprintTemplate.getJson());
      // console.log()
    }

    return {
        base,
        setPaper,
        changeScale,
        rotatePaper,
        preView,
        preViewEle,
        print,
        onlyPrint,
        clearPaper,
        viewJsonFun,
    }
}